<template>
	<view class="wrap">
		<view class="topBc"></view>
		<view class="content formWrap">
			
			<!-- textLength -->
			
			<view class="title" style="margin-top: 0;">
				<text>海关注册信息</text>
			</view>
			
			<u-form :model="formData" ref="uForm" :rules="rules">
				<u-form-item v-if="formKeys.enfullco" label="英文名称" prop="enfullco" label-width="auto" borderBottom>
					<u-input v-model="formData.enfullco" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.enaddrco" label="英文地址" prop="enaddrco" label-width="auto" borderBottom>
					<u-input v-model="formData.enaddrco" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				<view class="textLength u-checkbox-group_wrap">
					<u-form-item v-if="formKeys.crossbordertradeflags" label="跨境贸易电子商务企业类型或非跨境贸易电子商务企业" prop="crossbordertradeflags" label-width="auto" borderBottom>
						<u-checkbox-group v-model="formData.crossbordertradeflags" placement="row">
							<u-checkbox :activeColor="bgColor" label="实物" v-for="ite,ind in 10" :key="ind"></u-checkbox>
						</u-checkbox-group>
					</u-form-item>
				</view>
				<u-form-item v-if="formKeys.accobanknm" label="开户银行" prop="accobanknm" label-width="auto" borderBottom>
					<u-input v-model="formData.accobanknm" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.accono" label="开户账号" prop="accono" label-width="auto" borderBottom>
					<u-input v-model="formData.accono" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.specialtradezone" label="特殊贸易区域" prop="specialtradezone" label-width="auto" borderBottom @click="pickerShow('specialtradezone')">
					<u-input v-model="specialtradezoneText" placeholder="请选择" border="none" inputAlign="right" disabled disabledColor="rgba(0,0,0,0)"></u-input>
					<u-icon slot="right" name="arrow-right"></u-icon>
				</u-form-item>
				<u-form-item v-if="formKeys.apanageregion" label="经济区划" prop="apanageregion" label-width="auto" borderBottom @click="pickerShow('apanageregion')">
					<u-input v-model="apanageregionText" placeholder="请选择" border="none" inputAlign="right" disabled disabledColor="rgba(0,0,0,0)"></u-input>
					<u-icon slot="right" name="arrow-right"></u-icon>
				</u-form-item>
				<u-form-item v-if="formKeys.siteflag" label="经营场所性质" prop="siteflag" label-width="auto" borderBottom @click="pickerShow('siteflag')">
					<u-input v-model="siteflagText" placeholder="请选择" border="none" inputAlign="right" disabled disabledColor="rgba(0,0,0,0)"></u-input>
					<u-icon slot="right" name="arrow-right"></u-icon>
				</u-form-item>
				<u-form-item v-if="formKeys.marketflag" label="是否上市公司" prop="marketflag" required label-width="auto" borderBottom>
					<u-radio-group v-model="formData.marketflag" placement="row">
						<u-radio v-for="item,index in stateRanges" :key="index" :label="item.text" :name="item.value" :activeColor="bgColor"></u-radio>
					</u-radio-group>
				</u-form-item>
				<u-form-item v-if="formKeys.accountflag" label="是否实行会计电算化" prop="accountflag" required label-width="auto" borderBottom>
					<u-radio-group v-model="formData.accountflag" placement="row">
						<u-radio v-for="item,index in stateRanges" :key="index" :label="item.text" :name="item.value" :activeColor="bgColor"></u-radio>
					</u-radio-group>
				</u-form-item>
				<u-form-item v-if="formKeys.finsoft && formData.accountflag=='1'" label="财务管理软件名称" prop="finsoft" required label-width="auto" borderBottom>
					<u-input v-model="formData.finsoft" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.accounttype" label="记账方式" prop="accounttype" label-width="auto" borderBottom @click="pickerShow('accounttype')">
					<u-input v-model="accounttypeText" placeholder="请选择" border="none" inputAlign="right" disabled disabledColor="rgba(0,0,0,0)"></u-input>
					<u-icon slot="right" name="arrow-right"></u-icon>
				</u-form-item>
				<!-- 待条件触发 -->
				<template>
					<view class="title">
						<text>委托代理记账单位信息</text>
					</view>
					<u-form-item label="单位名称" prop="accountname" required label-width="auto" borderBottom>
						<u-input v-model="formData.accountname" placeholder="请输入" border="none" inputAlign="right"></u-input>
					</u-form-item>
					<u-form-item label="统一社会信用代码" prop="accountsocialcreditcode" required label-width="auto" borderBottom>
						<u-input v-model="formData.accountsocialcreditcode" placeholder="请输入" border="none" inputAlign="right"></u-input>
					</u-form-item>
					<u-form-item label="单位地址" prop="accountaddr" required label-width="auto" borderBottom>
						<u-input v-model="formData.accountaddr" placeholder="请输入" border="none" inputAlign="right"></u-input>
					</u-form-item>
					<u-form-item label="单位联系人" prop="accountcontact" required label-width="auto" borderBottom>
						<u-input v-model="formData.accountcontact" placeholder="请输入" border="none" inputAlign="right"></u-input>
					</u-form-item>
					<u-form-item label="单位联系人电话" prop="accounttel" required label-width="auto" borderBottom>
						<u-input v-model="formData.accounttel" placeholder="请输入" border="none" inputAlign="right"></u-input>
					</u-form-item>
				</template>
				
				
				
				<view class="title">
					<text>关务负责人</text>
				</view>
				<u-form-item v-if="formKeys.cusspename" label="姓名" prop="cusspename" label-width="auto" borderBottom>
					<u-input v-model="formData.cusspename" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.cusspecertype" label="身份证件类型" prop="cusspecertype" label-width="auto" borderBottom @click="pickerShow('cusspecertype')">
					<u-input v-model="cusspecertypeText" placeholder="请选择" border="none" inputAlign="right" disabled disabledColor="rgba(0,0,0,0)"></u-input>
					<u-icon slot="right" name="arrow-right"></u-icon>
				</u-form-item>
				<u-form-item v-if="formKeys.cusspecerno" label="身份证件号码" prop="cusspecerno" label-width="auto" borderBottom>
					<u-input v-model="formData.cusspecerno" type="idcard" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.cusspetel" label="固定电话" prop="cusspetel" label-width="auto" borderBottom>
					<u-input v-model="formData.cusspetel" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.cusspemobile" label="移动电话" prop="cusspemobile" label-width="auto" borderBottom>
					<u-input v-model="formData.cusspemobile" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.cusspeemail" label="电子邮箱" prop="cusspeemail" label-width="auto" borderBottom>
					<u-input v-model="formData.cusspeemail" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				
				
				<view class="title">
					<text>海关业务联系人</text>
				</view>
				<u-form-item v-if="formKeys.contacname" label="姓名" prop="contacname" label-width="auto" borderBottom>
					<u-input v-model="formData.contacname" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.contacttel" label="固定电话" prop="contacttel" label-width="auto" borderBottom>
					<u-input v-model="formData.contacttel" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.contactmobile" label="移动电话" prop="contactmobile" label-width="auto" borderBottom>
					<u-input v-model="formData.contactmobile" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.contactemail" label="电子邮箱" prop="contactemail" label-width="auto" borderBottom>
					<u-input v-model="formData.contactemail" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.contactfax" label="传真" prop="contactfax" label-width="auto" borderBottom>
					<u-input v-model="formData.contactfax" placeholder="请输入" border="none" inputAlign="right"></u-input>
				</u-form-item>
				
				
				<view class="title">
					<text>经营补充信息（币种: 人民币）</text>
				</view>
				<u-form-item v-if="formKeys.sustainedlosses" label="最近三年是否连续亏损" prop="sustainedlosses" required label-width="auto" borderBottom>
					<u-radio-group v-model="formData.sustainedlosses" placement="row">
						<u-radio v-for="item,index in stateRanges" :key="index" :label="item.text" :name="item.value" :activeColor="bgColor"></u-radio>
					</u-radio-group>
				</u-form-item>
				<u-form-item v-if="formKeys.goodsinstock" label="存货" prop="goodsinstock" type="number" required label-width="460rpx" borderBottom>
					<u-input v-model="formData.goodsinstock" placeholder="请输入" border="none" inputAlign="right">
						<view class="units_suffix" slot="suffix">
							<text><text class="units_suffix_colorRed">万</text>(元)</text>
						</view>					</u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.cashliability" label="流动负债" prop="cashliability" type="number" required label-width="460rpx" borderBottom>
					<u-input v-model="formData.cashliability" placeholder="请输入" border="none" inputAlign="right">
						<view class="units_suffix" slot="suffix">
							<text><text class="units_suffix_colorRed">万</text>(元)</text>
						</view>					</u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.circulatingassets" label="流动资产" prop="circulatingassets" type="number" required label-width="460rpx" borderBottom>
					<u-input v-model="formData.circulatingassets" placeholder="请输入" border="none" inputAlign="right">
						<view class="units_suffix" slot="suffix">
							<text><text class="units_suffix_colorRed">万</text>(元)</text>
						</view>					</u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.netcashflow" label="经营现金净流量" prop="netcashflow" type="number" required label-width="460rpx" borderBottom>
					<u-input v-model="formData.netcashflow" placeholder="请输入" border="none" inputAlign="right">
						<view class="units_suffix" slot="suffix">
							<text><text class="units_suffix_colorRed">万</text>(元)</text>
						</view>					</u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.operatingprofit" label="营业利润" prop="operatingprofit" type="number" required label-width="460rpx" borderBottom>
					<u-input v-model="formData.operatingprofit" placeholder="请输入" border="none" inputAlign="right">
						<view class="units_suffix" slot="suffix">
							<text><text class="units_suffix_colorRed">万</text>(元)</text>
						</view>					</u-input>
				</u-form-item>
				<u-form-item v-if="formKeys.ownersequity" label="年初所有者权益" prop="ownersequity" type="number" required label-width="460rpx" borderBottom>
					<u-input v-model="formData.ownersequity" placeholder="请输入" border="none" inputAlign="right">
						<view class="units_suffix" slot="suffix">
							<text><text class="units_suffix_colorRed">万</text>(元)</text>
						</view>					</u-input>
				</u-form-item>
				
				
				<view class="title">
					<text>企业自律管理情况</text>
				</view>
				<view class="textLength">
					<u-form-item v-if="formKeys.isaudited" label="年度内是否开展内外部审计" prop="isaudited" required label-width="auto" borderBottom>
						<u-radio-group v-model="formData.isaudited" placement="row">
							<u-radio v-for="item,index in ranges2" :key="index" :label="item.text" :name="item.value" :activeColor="bgColor"></u-radio>
						</u-radio-group>
					</u-form-item>
				</view>
				<view class="textLength">
					<u-form-item v-if="formKeys.existingproblems" label="在内外部审计等企业自律管理中是否发现一般贸易业务、加工贸易及保税业务、减免税业务或其他进出口业务存在违反海关管理规定的问题。" prop="existingproblems" label-width="auto" borderBottom>
						<u-radio-group v-model="formData.existingproblems" placement="row">
							<u-radio v-for="item,index in stateRanges" :key="index" :label="item.text" :name="item.value" :activeColor="bgColor"></u-radio>
						</u-radio-group>
					</u-form-item>
				</view>
				<view class="textLength">
					<u-form-item v-if="formKeys.problems" label="具体问题" prop="problems" label-width="auto">
						<u--textarea v-model="formData.problems" placeholder="请输入" autoHeight ></u--textarea>
					</u-form-item>
				</view>
				
			</u-form>
			
		</view>
		<view class="submitBtn_bc"></view>
		<view class="submitBtn_ubtn">
			<u-button :disabled="!$util.submitState(year,state)" @click="submit()">提交</u-button>
		</view>
		
		<u-picker :show="specialtradezoneShow" :columns="specialtradezoneList" closeOnClickOverlay @cancel="pickerClose('specialtradezone')" @close="pickerClose('specialtradezone')" @confirm="pickerConfirm($event,'specialtradezone')"></u-picker>
		<u-picker :show="apanageregionShow" :columns="apanageregionList" closeOnClickOverlay @cancel="pickerClose('apanageregion')" @close="pickerClose('apanageregion')" @confirm="pickerConfirm($event,'apanageregion')"></u-picker>
		<u-picker :show="siteflagShow" :columns="siteflagList" closeOnClickOverlay @cancel="pickerClose('siteflag')" @close="pickerClose('siteflag')" @confirm="pickerConfirm($event,'siteflag')"></u-picker>
		<u-picker :show="accounttypeShow" :columns="accounttypeList" closeOnClickOverlay @cancel="pickerClose('accounttype')" @close="pickerClose('accounttype')" @confirm="pickerConfirm($event,'accounttype')"></u-picker>
		<u-picker :show="cusspecertypeShow" :columns="cusspecertypeList" closeOnClickOverlay @cancel="pickerClose('cusspecertype')" @close="pickerClose('cusspecertype')" @confirm="pickerConfirm($event,'cusspecertype')"></u-picker>
	
	</view>
</template>

<script>
export default {
	data(){
		return{
			minFormName: 'cuEntreginfo', //小表单类型名
			regnoInfo: this.$store.state.regnoInfo,
			year: '',
			state: '',
			bgColor: this.$config.bgColor,
			
			specialtradezoneShow: false,
			apanageregionShow: false,
			siteflagShow: false,
			accounttypeShow: false,
			cusspecertypeShow: false,
			specialtradezoneText: '',
			apanageregionText: '',
			siteflagText: '',
			accounttypeText: '',
			cusspecertypeText: '',
			
			stateRanges: [
				{text: '是',value: '1'},
				{text: '否',value: '2'}
			],
			ranges2: [
				{text: '内部审计',value: '1'},
				{text: '外部审计',value: '2'}
			],
			specialtradezoneList: [[
				{text: '暂未配置', value: '1'},
				{text: '暂未配置', value: '2'},
			]],
			apanageregionList: [[
				{text: '暂未配置', value: '1'},
				{text: '暂未配置', value: '2'},
			]],
			siteflagList: [[
				{text: '暂未配置', value: '1'},
				{text: '暂未配置', value: '2'},
			]],
			accounttypeList: [[
				{text: '暂未配置', value: '1'},
				{text: '暂未配置', value: '2'},
			]],
			cusspecertypeList: [[
				{text: '暂未配置', value: '1'},
				{text: '暂未配置', value: '2'},
			]],
			
			formData: {
				enfullco: '',
				enaddrco: '',
				crossbordertradeflags: '',
				accobanknm: '',
				accono: '',
				
				specialtradezone: '',
				apanageregion: '',
				cusspename: '',
				cusspecertype: '',
				cusspecerno: '',
				
				cusspetel: '',
				cusspemobile: '',
				cusspeemail: '',
				contacname: '',
				contacttel: '',
				
				contactmobile: '',
				contactemail: '',
				contactfax: '',
				siteflag: '',
				marketflag: '',
				
				accountflag: '',
				finsoft: '',
				accounttype: '',
				accountname: '',
				accountsocialcreditcode: '',
				
				accountaddr: '',
				accountcontact: '',
				accounttel: '',
				sustainedlosses: '',
				goodsinstock: '',
				
				cashliability: '',
				circulatingassets: '',
				netcashflow: '',
				operatingprofit: '',
				ownersequity: '',
				
				isaudited: '',
				existingproblems: '',
				problems: '',
			},
			rules: {},
			rulesAll: {
				enfullco: this.$typeData.ruleData.inputRule,
				enaddrco: this.$typeData.ruleData.inputRule,
				crossbordertradeflags: this.$typeData.ruleData.disRule,
				accobanknm: this.$typeData.ruleData.inputRule,
				accono: this.$typeData.ruleData.peopleRule,
				
				specialtradezone: this.$typeData.ruleData.disRule,
				apanageregion: this.$typeData.ruleData.disRule,
				cusspename: this.$typeData.ruleData.inputRule,
				cusspecertype: this.$typeData.ruleData.disRule,
				cusspecerno: this.$typeData.ruleData.idCardRule,
				
				cusspetel: this.$typeData.ruleData.telRule,
				cusspemobile: this.$typeData.ruleData.telRule,
				cusspeemail: this.$typeData.ruleData.emailRule,
				contacname: this.$typeData.ruleData.inputRule,
				contacttel: this.$typeData.ruleData.telRule,
				
				contactmobile: this.$typeData.ruleData.telRule,
				contactemail: this.$typeData.ruleData.emailRule,
				contactfax: this.$typeData.ruleData.inputRule,
				siteflag: this.$typeData.ruleData.disRule,
				marketflag: this.$typeData.ruleData.disRule,
				
				accountflag: this.$typeData.ruleData.disRule,
				finsoft: this.$typeData.ruleData.inputRule,
				accounttype: this.$typeData.ruleData.disRule,
				accountname: this.$typeData.ruleData.inputRule,
				accountsocialcreditcode: this.$typeData.ruleData.peopleRule,
				
				accountaddr: this.$typeData.ruleData.inputRule,
				accountcontact: this.$typeData.ruleData.inputRule,
				accounttel: this.$typeData.ruleData.telRule,
				sustainedlosses: this.$typeData.ruleData.disRule,
				goodsinstock: this.$typeData.ruleData.moneyRule,
				
				cashliability: this.$typeData.ruleData.moneyRule,
				circulatingassets: this.$typeData.ruleData.moneyRule,
				netcashflow: this.$typeData.ruleData.moneyRule,
				operatingprofit: this.$typeData.ruleData.moneyRule,
				ownersequity: this.$typeData.ruleData.moneyRule,
				
				isaudited: this.$typeData.ruleData.disRule,
				existingproblems: this.$typeData.ruleData.disRule,
				problems: this.$typeData.ruleData.inputRule,
			},
			formKeys: {},
			
		}
	},
	onLoad(option) {
		this.year = option.year;
		this.state = option.state;
		this.getFormKey();
		this.getFormData();
	},
	onReady() {
		this.$refs.uForm.setRules(this.rules)
	},
	methods:{
		setInitPicker(value,dataName){
			let listName = `${dataName}List`
			let arr = this[listName][0];
			let obj = {};
			for(let i=0; i<arr.length; i++){
				if(arr[i].value == value){
					obj = arr[i];
					break;
				}
			}
			if(obj.value){
				this.formData[dataName] = obj.value;
				this[`${dataName}Text`] = obj.text;
			}
		},
		pickerConfirm(e,dataName){
			let data = e.value[0];
			this.setInitPicker(data.value,dataName);
			this.pickerClose(dataName);
		},
		pickerShow(dataName){
			let name = `${dataName}Show`
			this[name] = true;
		},
		pickerClose(dataName){
			let name = `${dataName}Show`
			this[name] = false;
		},
		// 获取小表单数据
		getFormData(){
			let url = this.$typeData.minFormUrl.get(this.minFormName);
			if(!url){
				uni.showModal({
					title: '暂无接口'
				})
				return;
			}
			this.$http.sendRequest({
				url: url,
				data: {
					regno: this.regnoInfo.regno,
					ancheyear: this.year
				}
			})
			.then(res=>{
				console.log('接口返回',res.data);
				let data = res.data[0];				let keys = Object.keys(this.formKeys);				keys.forEach(item=>{					this.formData[item] = data[item];				})
				console.log(789789,this.formData);
			})
			.catch(err=>{})
		},
		//获取小表单拥有字段
		getFormKey(){
			let formKeys = this.$util.getFormKeys(this.minFormName,this.regnoInfo.enttype);
			this.formKeys = formKeys;
			let keys = Object.keys(formKeys);
			keys.forEach(item=>{
				this.rules[item] = this.rulesAll[item];
			})
		},
		submit(){
			let _this = this;
			this.$refs.uForm.validate().then(res => {
				this.saveBtn();
			}).catch(errors => {
				this.$util.showToast({title:'请完善信息'})
			})
		},
		saveBtn(){
			let data = this.$util.setSaveFormData(this.formKeys,'',this.formData)
			this.$http.sendRequest({
				url: '/annual/report/cu-entreginfo/overwrite',
				method: 'PUT',
				data: {
					regno: this.regnoInfo.regno,
					ancheyear: this.year,
					cuEntreginfoList: [data]
				}
			})
			.then(res=>{
				this.setRecord();
			})
			.catch(err=>{})
		},
		
		
		//存一下记录
		setRecord(){
			let fillingItem = this.$minFormType.get(this.minFormName);
			this.$http.sendRequest({
				url: '/annual/report/record',
				method: 'POST',
				data: {
					regno: this.regnoInfo.regno,
					year: this.year,
					fillingItem: fillingItem,
					isImp: '0',
				},
				hideLoad: true,
			})
			.then(res=>{
				uni.navigateBack();
			})
			.catch(err=>{})
		},
		goPage(path){
			uni.navigateTo({
				url: path
			})
		},
	}
}
</script>

<style lang="scss">
.wrap{
	width: 100vw;
	min-height: 100vh;
	padding-top: 16rpx;
	box-sizing: border-box;
	position: relative;
	background-color: #FFF;
	
	.topBc{
		height: 10rpx;
		background-color: #F5F6F8;
	}
}

.content{
	padding: 30rpx 36rpx;
	background-color: #FFF;
	
	.title{
		color: #E4B269;
		font-size: 36rpx;
		font-weight: bold;
		border-left: 8rpx solid #E4B269;
		line-height: 40rpx;
		padding-left: 16rpx;
		margin-bottom: 30rpx;
		margin-top: 30rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		
		.hint{
			background-color: teal;

		}
	}
	
}

.u-radio-group_wrap{
	.u-radio{
		margin-left: 20rpx;
		margin-right: 0;
	}
}

.u-checkbox-group_wrap{
	.u-checkbox-group{
		display: flex;
		flex-flow: wrap;
	}
	.u-checkbox{
		margin: 0 10rpx 10rpx;
	}
}

</style>